<html>
<script src="./jquery.min.js"></script>

<body>
    <input type="text" id="port" value="8887" />
    <button id="start" onclick="start()">Start</button>
    <button id="stop" onclick="stop()">Stop</button>
</body>
<script>
    msg_center.on((event, msg) => {
        console.log(msg);
        switch (msg.code) {
            case 100:
                $('#port')[0].value = msg.cfg.port;
                break;
            case 200:
                $('#start').hide();
                $('#stop').show();
                break;
            case 201:
                $('#start').show();
                $('#stop').hide();
                break;
            default:
                break;
        }
    });

    function start() {
        const port = $('#port')[0].value;
        msg_center.send({ code: 200, cfg: { port: port } });
    }

    function stop() {
        msg_center.send({ code: 201 });
    }

    $('#start').show();
    $('#stop').hide();
    msg_center.send({ code: 100 });
</script>

</html>